<template>
  <div class="modi-address">
    <!-- <HeaderTop title="新增地址"></HeaderTop> -->
    <van-address-edit
      class="addAddress"
      :area-list="areaList"
      show-delete
      show-set-default
      @save="onSave"
      @delete="onDelete"
    />
  </div>
</template>

<script>
// import HeaderTop from '../HeaderTop/HeaderTop'
import areaListInfo from '../../common/js/area.js'
import {mapState} from 'vuex'
export default {
  data () {
    return {
      areaList:areaListInfo,
    };
  },

  // components: {
  //   HeaderTop,
  // },

  computed: {
    ...mapState(['userInfo'])
  },
  mounted(){
    this.userId = this.userInfo.userInfo.id
    this.token = this.userInfo.token
  },
  methods: {
    async onSave(e) {
      console.log('e',e) // 新增地址{}
      let consignee = e.name
      let mobile = e.tel
      let area = e.province
      let address = e.addressDetail
      let city = e.city
      let county = e.county
      let areaCode = e.areaCode
      let ifDefault = e.isDefault == true ? 0 : 1
      console.log(this.userId,this.token,consignee,mobile,area,address,city,county,areaCode,ifDefault)
      let result = await this.API.reqaddAddress(
        {userId:this.userId,token:this.token,consignee,mobile,area,address,code:1,city,county,areaCode,id:'',ifDefault})
      console.log(result)
      if(result.retCode === '000'){
        this.$toast('保存成功');
        this.$router.push({path:'/addresslist', query: {check: this.$route.query.check}})
      }else{
        this.$toast(result.retMsg);
      }
    },
    onDelete(e) {
      console.log(e)
      for(let key in e){
        e[key] = ''
      }
      this.$toast('删除成功');
    },
  }
}

</script>
<style lang='stylus'>
.addAddress
  .van-cell
    padding-left 20px
  .van-address-edit-detail
    .van-cell__value
      .van-cell
        padding-left 0
  .van-switch-cell
    .van-cell__value
      .van-switch--on
        background-color #145B3E
.van-button--danger
  border none 
  background #145B3E
</style>

<style lang='stylus' scoped>
@import "../../common/stylus/mixins.styl"
.modi-address
  // margin-top 45px
  overflow hidden
  background #fff
  width 100%
  height 100%
  padding-bottom 0 !important 
</style>